<template>
  <div>
    <div>
      <div style="margin-top: 15px;">
        <el-col :span="6">
          <el-input placeholder="请输入员工姓名进行查询" v-model="accountName" class="input-with-select">

            <el-button slot="append" icon="el-icon-search" @click="getByName">查询</el-button>
          </el-input>
        </el-col>
        <el-button type="infor" style="position: relative;left: 850px;" @click="addAccount">新增员工<i class="el-icon-upload el-icon--right"></i></el-button>
      </div>
    </div>
    <el-table :data="getAccountByPage" style="width: 100%">
      <el-table-column prop="accountId" label="员工编号" width="180">
      </el-table-column>
      <el-table-column prop="accountName" label="员工姓名" width="180">
      </el-table-column>
      <el-table-column prop="accountLoginid" label="员工账户" width="180">
      </el-table-column>
      <el-table-column prop="accountTel" label="电话号码" width="180">
      </el-table-column>
      <el-table-column prop="accountEmail" label="电子邮箱" width="180">
      </el-table-column>
      <!-- <el-table-column prop="status" label="状态" width="150">
                <template #default="scope">
                  <span>{{scope.row.status==1?'话题进行中':'话题已结束'}}</span>
                </template>
              </el-table-column> -->
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button icon="el-icon-edit" @click="changemessage(scope.row)" type="primary">修改信息</el-button>
          <!-- <el-button icon="el-icon-edit" @click="changerole(scope.row.accountId)" type="primary">角色授权</el-button> -->
          <el-button icon="el-icon-edit" @click="changeaccountrole(scope.row.accountId)" type="primary">分配</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination fixed @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pages.current"
      :page-sizes="[1, 2, 3, 4]" :page-size="pages.size" layout="total, sizes, prev, pager, next, jumper" :total="pages.total">
    </el-pagination>

    <el-dialog title="修改员工信息" :visible.sync="dialogVisible" width="30%">
      <el-form>
        姓名<el-input type="text" v-model="userinfo.accountName" disabled=""></el-input>
        账户<el-input type="text" v-model="userinfo.accountLoginid" disabled=""></el-input>
        电话<el-input type="text" v-model="userinfo.accountTel"></el-input>
        邮箱<el-input type="text" v-model="userinfo.accountEmail"></el-input>


      </el-form>
      <span slot="footer" class="dialog-footer">
        <!-- <el-button @click="dialogVisible = false">取 消</el-button> -->
        <el-button type="primary" @click="sure">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="职位分配" :visible.sync="dialogVisible2" width="30%">
      <el-select v-model="value" placeholder="请选择项目">
        <el-option v-for="item in Allproject" :key="item.projectId" :label="item.projectName" :value="item.projectId"
          v-if="item.projectState=='有效'">
        </el-option>
      </el-select>

      <el-select v-model="value2" placeholder="请选择职位">
        <el-option v-for="item in AllRole" :key="item.roleNum" :label="item.roleName" :value="item.roleNum" v-if="item.roleState=='有效'">
        </el-option>
      </el-select>
      <span slot="footer" class="dialog-footer">
        <!-- <el-button @click="dialogVisible = false">取 消</el-button> -->
        <el-button type="primary" @click="addrole">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="修改员工信息" :visible.sync="dialogVisible3" width="30%">
      <el-form>
        姓名<el-input type="text" v-model="adduserinfo.accountName"></el-input>
        账户<el-input type="text" v-model="adduserinfo.accountLoginid"></el-input>
        电话<el-input type="text" v-model="adduserinfo.accountTel"></el-input>
        邮箱<el-input type="text" v-model="adduserinfo.accountEmail"></el-input>
        性别<el-input type="text" v-model="adduserinfo.accountSex"></el-input>


      </el-form>
      <span slot="footer" class="dialog-footer">
        <!-- <el-button @click="dialogVisible = false">取 消</el-button> -->
        <el-button type="primary" @click="saveAccount">确 定</el-button>
      </span>
    </el-dialog>


    <!--  <el-dialog
             title="修改员工信息"
             :visible.sync="dialogVisible4"
             width="30%">
             <el-form>
               姓名<el-input type="text" v-model="getAccountByName.accountName"  disabled=""></el-input>
               账户<el-input type="text" v-model="getAccountByName.accountLoginid" disabled=""></el-input>
               电话<el-input type="text" v-model="getAccountByName.accountTel" disabled=""></el-input>
               邮箱<el-input type="text" v-model="getAccountByName.accountEmail" disabled=""></el-input>
               性别<el-input type="text" v-model="getAccountByName.accountSex" disabled=""></el-input>


             </el-form>
             <span slot="footer" class="dialog-footer">
              <!-- <el-button @click="dialogVisible = false">取 消</el-button> -->
    <!-- <el-button type="primary" @click="close">确 定</el-button> -->
    <!-- </span>
           </el-dialog> -->
  </div>
</template>

<script>
  export default {
    name: "accountmanagement",
    data() {
      return {
        getAccountByPage: [],
        getAccountsByName: [],
        pages: {},

        userinfo: {
          accountId: 0,
          accountName: "",
          accountLoginid: "",
          accountTel: "",
          accountEmail: ""
        },

        dialogVisible: false,
        dialogVisible2: false,
        dialogVisible3: false,

        accountId: 0,
        Allproject: [],
        AllRole: [],
        value: "",
        value2: "",
        user: {},
        adduserinfo: {
          accountSex: "",
          accountName: "",
          accountLoginid: "",
          accountTel: "",
          accountEmail: ""
        },
        accountName: "",
        getAccountByName: {
          accountId: 0,
          accountName: "",
          accountLoginid: "",
          accountTel: "",
          accountEmail: "",
          accountSex: ""
        },

      }

    },
    methods: {
      getAllAccount(current, size) {
        this.$http.post("/account/getAllAccount", {
          "current": current,
          "size": size
        }).then(resp => {
          this.getAccountByPage = resp.data.data.records
          this.pages = resp.data.data

        })
      },
      handleSizeChange(val) {

        this.pages.size = val
        this.getAllAccount(this.pages.num, val)
      },
      handleCurrentChange(val) {
        this.pages.current = val
        this.getAllAccount(val, this.pages.size)
      },
      changemessage(user) {
        this.dialogVisible = true
        this.userinfo = user
      },
      sure() {
        this.$http.post("/account/changeAccountMessage", this.userinfo).then(resp => {
          if (resp.data.code == 200) {
            this.$message({
              message: resp.data.message,
              type: 'success'
            })
          } else {
            this.$message.error(resp.data.message);
          }
          this.dialogVisible = false
        })
      },
      changeaccountrole(aid) {
        this.$http.get("/projectInfo/getAllProject").then(resp => {
          this.Allproject = resp.data.data
        })
        this.$http.get("role/getAllRole").then(resp => {
          this.AllRole = resp.data.data
        })
        this.dialogVisible2 = true
        this.accountId = aid
      },
      addrole() {
        this.$http.get("accountRoleProject/addProjectRole", {
          params: {
            "accountId": this.accountId,
            "projectId": this.value,
            "roleNum": this.value2
          }
        }).then(resp => {
          if (resp.data.code == 200) {
            this.$message({
              message: resp.data.message,
              type: 'success'
            })
          } else {
            this.user = resp.data.data
            this.$message.error(this.user.accountName + "已经是" + this.user.projectName + "的" + this.user.roleName +
              ",请勿重复分配")
          }
          this.dialogVisible2 = false
        })
      },
      addAccount() {
        this.dialogVisible3 = true

      },
      saveAccount() {
        this.$http.post("/account/addAccount", this.adduserinfo).then(resp => {
          if (resp.data.code == 200) {
            this.$message({
              message: resp.data.message + "，初始密码为123",
              type: 'success'
            })
          } else {
            this.$message.error(resp.data.message)
          }
          this.dialogVisible3 = false
          this.getAllAccount(1, 2)
        })
      },
      getByName(current, size) {
        let getByName2 = {
          "accountName": this.accountName,
          "current": 1,
          "size": 3
        }
        this.$http.post("account/getByName", getByName2).then(resp => {
          this.getAccountByPage = resp.data.data.records
          this.pages = resp.data.data
        })

      },



    },
    created() {
      this.getAllAccount(1, 2)
    }
  }
</script>

<style>
</style>
